// 生成tree
function generateTree() {
    // 存储zTree参数
    var setting = {
        "view": {
            "addDiyDom" : myAddDivDom,
            "addHoverDom" : myAddHoverDom,
            "removeHoverDom" : myRemoveHoverDom
        },
        "data": {
            "key" : {
                "url" : "maomi"
            }
        }
    };

    // 获取生成zTree的数据
    $.ajax({
        "url" : "menu/get/whole/tree.json",
        "type" : "post",
        "dataType" : "json",
        "success" : function (res) {
            if(res.state == "SUCCESS") {

                // 生成zTree
                $.fn.zTree.init($("#treeDemo"), setting, res.data);
            }else if(res.state == "ERROR"){
                layer.msg("菜单加载失败！" + res.message);
            }
        },
        "error" : function (res) {
            layer.msg(res,status + " " + res.statusText);
        }
    });
}

// 改变图标
function myAddDivDom(treeId, treeNode) {
    // treeId附着的静态dom
    console.log("treeId=" + treeId);
    // 每个Node的数据
    console.log("treeNode=" + treeNode);

    // 通过treeNode找到span标签
    var spanId = treeNode.tId + "_ico";
    // 移除旧的class并添加上icon
    $("#" + spanId).removeClass().addClass(treeNode.icon);


}

// 鼠标移入添加按钮组
function myAddHoverDom(treeId, treeNode) {

    // 设置按钮组id
    var btnGrpId = treeNode.tId + "_btnGrp";

    // 如果已存在标签组，就return
    if($("#" + btnGrpId).length > 0){
        return ;
    }

    // 准备各个按钮的html标签
    var addBtn = "<a id='" + treeNode.id + "' class='btn btn-info dropdown-toggle btn-xs addBtn' style='margin-left: 10px;padding-top: 0px;' href='#' title='添加子节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-plus rbg'></i></a>";
    var removeBtn = "<a id='" + treeNode.id + "' class='btn btn-info dropdown-toggle btn-xs removeBtn' style='margin-left: 10px;padding-top: 0px;' href='#' title='删除节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-times rbg'></i></a>";
    var editBtn = "<a id='" + treeNode.id + "' class='btn btn-info dropdown-toggle btn-xs editBtn' style='margin-left: 10px;padding-top: 0px;' href='#' title='修改节点'>&nbsp;&nbsp;<i class='fa fa-fw fa-edit rbg'></i></a>";

    // 获取当前节点的级别
    var level = treeNode.level;

    // 准备按钮组容器
    var btnGrp = "";

    // 判断当前节点的级别
    if(level == 0) {
        // 如果是根节点，只能添加节点
        btnGrp = addBtn;
    } else if(level == 1) {
        // 该子节点是分支节点时，可以添加和修改节点
        btnGrp = addBtn + " " + editBtn;

        // 获取children的长度
        var length = treeNode.children.length;

        // 如果没有子节点，可以删除节点
        if(length == 0)
            btnGrp = btnGrp + " " + removeBtn;
    } else if(level == 2) {
        // 该节点为叶子节点不能添加节点
        btnGrp = editBtn + " " + removeBtn;
    }


    // 获取a标签的id
    var anchorId = treeNode.tId + "_a";

    // 在a标签后面添加按钮组
    $("#" + anchorId).after("<span id='" + btnGrpId + "'>" + btnGrp + "</span>");



}

// 鼠标移出删除按钮组
function myRemoveHoverDom(treeId, treeNode) {

    // 设置按钮组id
    var btnGrpId = treeNode.tId + "_btnGrp";

    // 删除span
    $("#" + btnGrpId).remove();
}



// 点击添加子节点按钮事件
function menuAddMet() {
    $("#treeDemo").on("click", ".addBtn", function () {

        // 获取当前节点保存到全局变量中的Pid
        window.pid = this.id;

        $("#addMenuModal").modal("show");
        return false;
    });

    // 给添加子节点的保存按钮绑定点击事件
    $("#saveMenuBtn").click(function () {
        var pid = window.pid;
        var name = $("#addMenuModal [name=name]").val().trim();
        var url = $("#addMenuModal [name=url]").val().trim();
        var icon = $("#addMenuModal [name=icon]:checked").val();

        $.ajax({
            "url" : "menu/save.json",
            "type" : "post",
            "data" : {
                "pid" : pid,
                "name" : name,
                "url" : url,
                "icon" : icon,
                "isFather" : 1
            },
            "dataType" : "json",
            "success" : function (res) {
                if(res.state == "SUCCESS") {
                    layer.msg("保存成功！");

                    // 重新加载菜单数据
                    generateTree();

                }else if(res.state == "ERROR"){
                    layer.msg("操作失败！" + res.message);
                }
            },
            "error" : function (res) {
                layer.msg(res,status + " " + res.statusText);
            }
        });
        // 清理表单数据
        $("#resetMenutBtn").click();
        // 关闭模态框
        $("#addMenuModal").modal("hide");
    });

}

// 传入id 返回该id的TreeNode对象
function getCurrentNode(id) {
    // 获取zTreeObj对象
    var zTreeObj = $.fn.zTree.getZTreeObj("treeDemo");

    // 准备key value
    var key = "id";
    var value = id;

    // 返回currentNode
    var currentNode = zTreeObj.getNodeByParam(key, value);
    return currentNode;
}

// 点击修改子节点按钮事件
function menuEditMet() {
    $("#treeDemo").on("click", ".editBtn", function () {
        $("#editMenuModal").modal("show");

        // 将id保存到全局变量中
        window.id = this.id;
        // 获取currentNode
        var currentNode = getCurrentNode(window.id);


        $("#editMenuModal [name=name]").val(currentNode.name);
        $("#editMenuModal [name=url]").val(currentNode.url);
        // radio的回显是把一样的数据放到value里, 注意要加[]
        $("#editMenuModal [name=icon]").val([currentNode.icon]);


        return false;
    });


    // 点击保存按钮
    $("#editMenuBtn").click(function () {
        var name = $("#editMenuModal [name=name]").val();
        var url = $("#editMenuModal [name=url]").val();
        var icon = $("#editMenuModal [name=icon]:checked").val();


        $.ajax({
            "url" : "menu/edit.json",
            "type" : "post",
            "data" : {
                "id" : window.id,
                "name" : name,
                "url" : url,
                "icon" : icon,
                "isFather" : 1
            },
            "dataType" : "json",
            "success" : function (res) {
                if(res.state == "SUCCESS") {
                    layer.msg("保存成功！");

                    // 重新加载菜单数据
                    generateTree();

                }else if(res.state == "ERROR"){
                    layer.msg("操作失败！" + res.message);
                }
            },
            "error" : function (res) {
                layer.msg(res,status + " " + res.statusText);
            }
        });

        $("#editMenuModal").modal("hide");
    });
}

// 点击删除子节点按钮事件
function menuRemoveMet() {
    $("#treeDemo").on("click", ".removeBtn", function () {

        // 预先清除显示的p标签
        $("#menuNameDiv").empty();

        $("#confirmMenuModal").modal("show");


        // 将id保存到全局变量中
        window.id = this.id;
        // 获取currentNode
        var currentNode = getCurrentNode(window.id);

        // 准备p标签
        var p = "<p style='text-align: center;'>" + currentNode.name + "</p>";

        $("#menuNameDiv").append(p);

        return false;
    });

    $("#removeMenuBtn").click(function () {
        $.ajax({
            "url" : "menu/remove.json",
            "type" : "post",
            "data" : {
                "id" : window.id
            },
            "dataType" : "json",
            "success" : function (res) {
                if(res.state == "SUCCESS") {
                    layer.msg("删除成功！");

                    // 重新加载菜单数据
                    generateTree();

                }else if(res.state == "ERROR"){
                    layer.msg("操作失败！" + res.message);
                }
            },
            "error" : function (res) {
                layer.msg(res,status + " " + res.statusText);
            }
        });

        // 关闭模态框
        $("#confirmMenuModal").modal("hide");
    });
}